<html>
<head>
    <title>双预防系统</title>
    <link rel="stylesheet" href="../../../assets/theme-chalk/index.css">
    <link rel="stylesheet" href="../../../style.css">

    <style>
        body {
            background: #F0F2F6;
        }

        .main-head {
            background: #fff;
            padding-left: 10px;
            padding-top: 10px;
            margin-bottom: 0px;
            border: solid 1px #fff;
        }

        .chart-outer {
            height: 200px;
        }

        .inputW {
            width: 150px;
        }

        .itemW {
            width: 200px;
        }

        .formLabelWidth {
            width: 100px;
        }
    </style>
</head>
<body>
<div class="page" id="page-monitor">
    <div class="page-title">系统设置,作业管理</div>
    <div class="page-main">
        <el-row>
            <el-col :span="24">
                <div class="main-head">
                    <el-form :inline="true" size="small">
                        <el-form-item label="作业岗位">
                            <el-input placeholder="请输入" class="inputW" v-model="workPost"></el-input>
                        </el-form-item>
                        <el-form-item label="作业类型">
                            <el-select class="inputW" v-model="workType">
                                <el-option label="所有" value=""></el-option>
                                <el-option label="普通类型" value="1"></el-option>
                                <el-option label="特级动火作业" value="2"></el-option>
                                <el-option label="一级动火作业" value="3"></el-option>
                                <el-option label="二级动火作业" value="4"></el-option>
                                <el-option label="进入受限空间作业" value="5"></el-option>
                                <el-option label="盲板抽堵作业" value="6"></el-option>
                                <el-option label="高处作业" value="7"></el-option>
                                <el-option label="吊装作业" value="8"></el-option>
                                <el-option label="临时用电作业" value="9"></el-option>
                                <el-option label="动土作业" value="10"></el-option>
                                <el-option label="短路作业" value="11"></el-option>
                                <el-option label="检维修作业" value="12"></el-option>
                                <el-option label="是否有承包商作业" value="13"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="primary" @click="search">查询</el-button>
                            <el-button type="primary" @click="addBtn">增加作业</el-button>
                            <!--                            <el-button type="success" @click="search">导出模板</el-button>-->
                            <!--                            <el-button type="warning" @click="search">导出特种设备信息</el-button>-->
                            <el-button type="primary" @click="exportData">导出</el-button>
                        </el-form-item>
                    </el-form>
                </div>
                <el-table :data="tableData" height="660" :stripe="true" :border="true" size="mini" style="width: 100%">
                    <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
                    <el-table-column prop="workType" label="作业类型">
                        <template slot-scope="scope">
                            <template v-if="scope.row.workType==1">
                                普通类型
                            </template>
                            <template v-if="scope.row.workType==2">
                                特级动火作业
                            </template>
                            <template v-if="scope.row.workType==3">
                                一级动火作业
                            </template>
                            <template v-if="scope.row.workType==4">
                                二级动火作业
                            </template>
                            <template v-if="scope.row.workType==5">
                                进入受限空间作业
                            </template>
                            <template v-if="scope.row.workType==6">
                                盲板抽堵作业
                            </template>
                            <template v-if="scope.row.workType==7">
                                高处作业
                            </template>
                            <template v-if="scope.row.workType==8">
                                吊装作业
                            </template>
                            <template v-if="scope.row.workType==9">
                                临时用电作业
                            </template>
                            <template v-if="scope.row.workType==10">
                                动土作业
                            </template>
                            <template v-if="scope.row.workType==11">
                                短路作业
                            </template>
                            <template v-if="scope.row.workType==12">
                                检维修作业
                            </template>
                            <template v-if="scope.row.workType==13">
                                是否有承包商作业
                            </template>
                        </template>
                    </el-table-column>
                    <el-table-column prop="workPost" label="作业岗位"></el-table-column>
                    <el-table-column prop="workContent" label="作业活动"></el-table-column>
                    <el-table-column prop="remark" label="备注"></el-table-column>
                    <el-table-column prop="stationName" label="操作">
                        <template slot-scope="scope">
                            <el-button @click="editClick(scope.row)" round size="small" icon="el-icon-edit"></el-button>
                            <el-button icon="el-icon-delete" round size="small"
                                       @click="removeItem(scope.row.Id)"></el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <div class="page-footer">
                    <el-pagination background layout="prev, pager, next" :pagesize="pagesize" :total="totalCount"
                                   :current-page.sync="pageno" @current-change="onChangePage">
                    </el-pagination>
                </div>
            </el-col>
        </el-row>
        <el-row>

        </el-row>
        <el-dialog :title="editMod?'编辑作业':'新增作业'" :visible.sync="dialogFormVisible">
            <el-form :model="param" ref="formName" :inline="true">
                <el-form-item label="作业类型" :rules="[
                             {required:true,message:'作业类型!',trigger:'blur'}
                            ]" :label-width="130">
                    <el-select class="inputW" v-model="param.workType" style="width: 200px" @change="select_status">
                        <el-option label="请选择" value=""></el-option>
                        <el-option label="普通类型" value="1"></el-option>
                        <el-option label="特级动火作业" value="2"></el-option>
                        <el-option label="一级动火作业" value="3"></el-option>
                        <el-option label="二级动火作业" value="4"></el-option>
                        <el-option label="进入受限空间作业" value="5"></el-option>
                        <el-option label="盲板抽堵作业" value="6"></el-option>
                        <el-option label="高处作业" value="7"></el-option>
                        <el-option label="吊装作业" value="8"></el-option>
                        <el-option label="临时用电作业" value="9"></el-option>
                        <el-option label="动土作业" value="10"></el-option>
                        <el-option label="短路作业" value="11"></el-option>
                        <el-option label="检维修作业" value="12"></el-option>
                        <el-option label="是否有承包商作业" value="13"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="作业岗位" :label-width="130" :rules="[
                             {required:true,message:'作业岗位!',trigger:'blur'}
                            ]">
                    <el-input v-model="param.workPost" autocomplete="off" class="itemW"
                              prop="workPost"></el-input>
                </el-form-item>
                <el-form-item label="作业活动" :label-width="130" :rules="[
                             {required:true,message:'作业活动!',trigger:'blur'}
                            ]">
                    <el-input v-model="param.workContent" autocomplete="off" class="itemW"
                              prop="workContent"></el-input>
                </el-form-item>
                <el-form-item label="备注" :label-width="130">
                    <el-input v-model="param.remark" autocomplete="off" class="itemW"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="submitClick">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</div>
<script type='text/javascript' src='../../../assets/bundle.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../assets/jquery-1.11.2.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../assets/echarts.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../js/common.js' charset='utf-8'></script>
<script type='text/javascript' src='../../../js/component.js' charset='utf-8'></script>
<script>
    var vuePage = new Vue({
        el: '#page-monitor',
        data: {
            workType: '',
            dialogFormVisible: false,
            formLabelWidth: '120px',
            currentPage: 1,
            tableData: [],
            dialogFormVisible: false,
            param: {
                Id: '',
                workPost: '',
                workContent: '',
                remark: '',
            },
            pagesize: 10,
            pageno: 1,
            totalCount: 0,
            tableData: [],
            workPost: '',
            editMod: false,
            Chargerlist: []
        },
        created: function () {
            let proNo =   HttpUtil.getQueryString('projectNo');
            if (proNo) SiteConfig.account.projectNo = proNo;
            this.loadData();
        },
        methods: {
            select_status() {
                this.$forceUpdate();
            },
            exportData() {
                HttpUtil.get('WorkContent/ExportWorkContent', {projectNo: SiteConfig.account.projectNo}).success((res) => {
                    this.$message.success('导出成功');
                    window.location = SiteConfig.webApiset + res.data;
                })
            },
            editClick(row) {
                // this.param = row;
                this.param = Object.assign(this.param, row);
                this.param.workType = row.workType.toString();
                this.dialogFormVisible = true;
                this.editMod = true;
            },
            loadData: function () {
                var param = {};
                if (this.workPost)
                    param.workPost = this.workPost;
                if (this.workType)
                    param.workType = this.workType;
                // if (SiteConfig.account.projectNo)
                //     param.projectNo = SiteConfig.account.projectNo;
                param.projectNo = SiteConfig.account.projectNo;
                param.pageno = this.pageno;
                param.pagesize = this.pagesize;
                HttpUtil.get('WorkContent/List', param).success((res) => {
                    vuePage.tableData = res.data;
                    vuePage.totalCount = res.total;
                });
            },
            addBtn: function () {
                this.editMod = false;
                // var obj = this.param;
                // for (key in obj) {
                //     this.param[key] = '';
                // }
                // this.form.reset()
                // this.param = [];
                this.param.Id = '';
                this.dialogFormVisible = true;
            },
            submitClick() {

                if (!this.param.workType) {
                    this.$message({type: 'error', message: '作业类型不能为空'})
                    return;
                }
                if (!this.param.workPost) {
                    this.$message({type: 'error', message: '作业岗位不能为空'})
                    return;
                }

                if (!this.param.workContent) {
                    this.$message({type: 'error', message: '作业活动不能为空'})
                    return;
                }
                this.param.projectNo = SiteConfig.account.projectNo;
                // this.param.Id = this.param.id;
                if (vuePage.editMod) {
                    HttpUtil.get('WorkContent/Update', this.param).success((r) => {
                        if (r.state == 0) {
                            this.totalCount = r.total;
                            this.$message({
                                message: '修改成功！',
                                type: 'success'
                            });
                            vuePage.loadData();
                            setTimeout(function () {
                                vuePage.dialogFormVisible = false;
                            }, 1000)
                        } else {
                            vuePage.$message({type: 'error', message: '修改失败'})
                        }
                    })
                } else
                    HttpUtil.get('WorkContent/Add', this.param).success((r) => {
                        if (r.state == 0) {
                            this.totalCount = r.total;
                            this.$message({
                                message: '添加成功！',
                                type: 'success'
                            });
                            vuePage.loadData();
                            setTimeout(function () {
                                vuePage.dialogFormVisible = false;
                            }, 1000)
                        } else {
                            vuePage.$message({type: 'error', message: '添加失败'})
                        }
                    })
            },
            removeItem: function (id) {
                if (!id) {
                    this.$message({
                        type: 'info',
                        message: 'id为空'
                    });
                    return;
                }
                this.$confirm('此操作将永久删除, 是否继续?, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning',
                    center: true
                }).then(() => {
                    var p = {};
                    p.Ids = id;
                    HttpUtil.get('WorkContent/Delete', p).success((r) => {
                        if (r.state == 0) {
                            vuePage.$message({
                                type: 'success',
                                message: '删除成功!'
                            });
                            vuePage.loadData();
                        } else {
                            vuePage.$message.error('删除失败!');
                        }
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });

            },
            onChangePage(page) {
                this.pageno = page;
                this.loadData();
            },
            search: function () {
                this.loadData();
            },
            onCheckbox: function (row) {
            }
        },

        mounted: function () {
            /* 表格值
            this.eleITableData=[{
                name:'A相电流',
                max:566,
                maxTime:'2018-3-5 11:11:45',
                min:34,
                minTime:'2018-11-12 15:33:33',
                avg:456
            },{
                name:'B相电流',
                max:566,
                maxTime:'2018-3-5 11:11:45',
                min:34,
                minTime:'2018-11-12 15:33:33',
                avg:456
            },{
                name:'C相电流',
                max:566,
                maxTime:'2018-3-5 11:11:45',
                min:34,
                minTime:'2018-11-12 15:33:33',
                avg:456
            }];*/


        }
    });
</script>
</body>
</html>
